<template>
    <p>Vue</p>
    {{ name }}
    <p>num:{{ num }}</p>
    <p>obj:{{ obj }}</p>
    <h1>props</h1>
    <p>title:{{ title }}</p>
    <p>msg:{{ msg }}</p>
    <h1>methods</h1>
    <button @click="test">点击就送</button>
    <h1>computed</h1>
    <p>unm2:{{ num2 }}</p>
    <p>unm3:{{ num3 }}</p>
    <button @click="addOne">num +1</button>
    <h1>watch</h1>
</template>

<script>
export default{
    props:{
        title:'',
        msg:{
            type:String,
            default:"默认值"

        }
    },
    data(){
        return{
            name:'李白123123',
            num:1,
            obj:{
                a:1,
                b:2
            }
        }
    },
    computed:{
        num2(){
            return this.num + "test"
        },
        num3(){
            return this.num + "testll"
        }
    },
    watch:{
        num:function  (newVal,olo){
            console.log('newVal',newVal);
            console.log('newVal',newVal);
        }
    },
    methods:{
        testFn(){
            console.log(123);
            console.log(name);
            console.log(num);
            this.testA()

        },
        testA(){
            console.log('testA');
        },
        addOne(){
            this.num =this.num + 1
        }
    }
}
</script>